﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Report.aspx.cs" Inherits="Page_Customer_Report" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no" />
    <title>查看报告</title>

    <link href="../../Content/syzyy/css/ylt_common.css" rel="stylesheet" />
    <link href="../../Content/syzyy/css/mobiscroll_date.css" rel="stylesheet" />
    <link href="../../layui/css/layui.css" rel="stylesheet" />
    <script src="../../Scripts/jquery-1.8.0.min.js"></script>
    <script src="../../Content/syzyy/js/mobiscroll_date.js"></script>
    <script src="../../Content/syzyy/js/mobiscroll.js"></script>
    <script src="../../layui/layui.js"></script>
    <style>
        body {
            background-color: mintcream;
            font-family: sans-serif;
        }

        .header {
            padding: .78125rem .3125rem .78125rem .46875rem;
            min-height: 2.8125rem;
            background: #fff;
        }

        .box-shadow {
            box-shadow: 0 0.046rem 0.093rem #ddd;
            margin-bottom: .312rem;
        }

        .header > img {
            margin-right: .3125rem;
            width: 3.05rem;
            height: 3.05rem;
            vertical-align: top;
        }

        .header > div {
            display: inline-block;
            vertical-align: top;
            width: 16rem;
        }

            .header > div > .status {
                font-size: 1.4rem;
                line-height: 1.4rem;
            }

            .header > div > p {
                font-size: 1.3rem;
                margin-top: .3125rem;
                line-height: 1.3rem;
            }

        .report-item {
            background: #fff;
            margin-bottom: .156rem;
        }

        .report-item-title {
            border-bottom: #e5e5e5 1px solid;
            line-height: 1.093rem;
        }

            .report-item-title img {
                display: inline-block;
                width: 1.3rem;
                margin: 10px 0.156rem 10px 0.281rem;
                vertical-align: middle;
            }

        .report-item-name {
            color: #f38321;
            vertical-align: middle;
        }

        .fs-26px {
            font-size: 1.2rem;
        }

        span {
            display: inline-block;
        }

        .data-card-tr {
            margin: 0 .468rem;
            line-height: 1.024rem;
            border-bottom: 1px solid #e5e5e5;
            font-size: .415rem;
        }

        .report-list .data-card-th {
            margin-right: .237rem;
            min-width: 2.4rem;
        }

        .data-card-th {
            color: #666;
        }

        .data-card-td {
            color: #333;
        }


        .data-card-tr:last-child {
            border: none;
        }

        .data-card-tr {
            margin: 4px .468rem;
            line-height: 1.9rem;
            font-size: 0.99rem;
            border-bottom: 1px solid #e5e5e5;
        }

        .report-item-btn {
            display: inline-block;
            margin-right: .468rem;
            line-height: 2.75rem;
        }

        .fs-22px {
            font-size: 1.08375rem;
        }

        .fr {
            float: right;
        }

        .report-item-btn span {
            line-height: 1.72rem;
            height: 1.72rem;
            width: 4.656rem;
            color: #fff;
            border-radius: 4px;
            background: #85bf44;
            text-align: center;
            vertical-align: middle;
        }

        .report-item-state {
            color: #78b82c;
        }

        /*无报告时的样式*/
        .no_report_bg {
            text-align: center;
            margin-top: 35%;
        }

        .tips {
            text-align: center;
            line-height: 3.5rem;
            font-size: 1.3rem;
            font-family: "microsoft yahei";
            margin-top: 10%;
        }

        .no_report_bgimg {
            display: block;
            max-width: 100%;
            margin: 0 auto;
            border: 0;
        }
    </style>
</head>
<body>
    <div class="report-list ng-scope">

        <header class="header box-shadow">
            <img src="../../Images/xhImg/report.png" />
            <div>
                <div class="status">查看报告</div>
                <p>
                    以下是您的各类报告记录。
                </p>
            </div>
        </header>

        <section id="reportList">
            <%--  <div class="report-item ng-scope">
                <div class="report-item-title">
                    <img src="../../Images/xhImg/report1.png" />
                    <span class="report-item-name fs-26px ng-binding">妇科彩超检查_子...</span>
                    <div class="report-item-btn fr fs-22px ng-scope">
                        <span>查看详情</span>
                    </div>
                </div>

                <div class="data-card-tr">
                    <span class="data-card-th">姓名：</span>
                    <span class="data-card-td ng-binding">司亚兰</span>
                </div>
                <div class="data-card-tr">
                    <span class="data-card-th">送检日期：</span>
                    <span class="data-card-td ng-binding">2018-12-07</span>
                </div>
                <div class="data-card-tr">
                    <span class="data-card-th">状态：</span>
                    <span class="data-card-td  ng-binding">已出报告</span>
                </div>
            </div>

            <div class="report-item ng-scope">
                <div class="report-item-title">
                    <img src="../../Images/xhImg/report1.png" />
                    <span class="report-item-name fs-26px ng-binding">妇科彩超检查_子...</span>
                </div>

                <div class="data-card-tr">
                    <span class="data-card-th">姓名：</span>
                    <span class="data-card-td ng-binding">司亚兰</span>
                </div>
                <div class="data-card-tr">
                    <span class="data-card-th">送检日期：</span>
                    <span class="data-card-td ng-binding">2018-12-07</span>
                </div>
                <div class="data-card-tr">
                    <span class="data-card-th">状态：</span>
                    <span class="data-card-td  ng-binding report-item-state">未出报告</span>
                </div>
            </div>--%>
        </section>

    </div>

    <div style="display: none;" id="tips">
        <header class="no_report_bg">
            <img class="no_report_bgimg" src="../../Content/syzyy/img/no_report.png" />
        </header>
        <p class="tips">
            暂无检验项目
        </p>
    </div>

    <div style="text-align: center; display: none;" id="mask" class="mask">
        <img src="../../Images/m-tips-loading.gif" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);" />
    </div>
    <script type="text/javascript">
        $().ready(function () {
            //$(".header").hide();
            showMask();
            GetList();

        });
        function GetList() {
            $.post("/Handler/SyzyyHandler.ashx?action=GetReportList", { Openid: '<%=openid%>' }, function (data) {
                var list = eval("(" + data + ")");
                if (typeof (list) != "undefined") {
                    if (typeof (list.status) == 'undefined') {

                        var html = "";
                        var detill = ' <div class="report-item-btn fr fs-22px ng-scope">' +
                                                '<span>查看详情</span>' +
                                            '</div>';
                        var reportState = '<span class="data-card-td  ng-binding">未出报告</span>';
                        var reportState1 = '<span class="data-card-td  ng-binding report-item-state">已出报告</span>';

                        var temp = '<div class="report-item ng-scope">' +
                                         '<a href="{hrefUrl}"><div class="report-item-title">' +
                                            '<img src="../../Images/xhImg/report1.png" />' +
                                            '<span class="report-item-name fs-26px ng-binding">{ReportName}</span>{detial}</div></a>' +
                                        '<div class="data-card-tr">' +
                                            '<span class="data-card-th">姓名：</span>' +
                                            '<span class="data-card-td ng-binding">{PatiName}</span>' +
                                        '</div>' +
                                        '<div class="data-card-tr">' +
                                            '<span class="data-card-th">送检日期：</span>' +
                                            '<span class="data-card-td ng-binding">{ReportDate}</span>' +
                                        '</div>' +
                                        '<div class="data-card-tr">' +
                                            '<span class="data-card-th">状态：</span>{ReportState}</div>' +
                                   '</div>';
                        if (list.length > 0) {
                            $("#tips").hide();
                            for (var i = 0; i < list.length; i++) {
                                var htmlchild = "";

                                htmlchild = temp.replace(/{PatiName}/, list[i].PatiName).replace(/{ReportDate}/, list[i].ReportDate).replace(/{ReportName}/, list[i].ReportName);
                                if (list[i].ReportState == "已出报告") {
                                    htmlchild = htmlchild.replace(/{detial}/, detill)
                                } else {
                                    htmlchild = htmlchild.replace(/{detial}/, "")
                                }

                                if (list[i].ReportState == "已出报告") {
                                    htmlchild = htmlchild.replace(/{ReportState}/, reportState1)
                                    var aaa = escape(JSON.stringify(list[i]));
                                    htmlchild = htmlchild.replace(/{hrefUrl}/, "ReportDetial.aspx?reportList=" + aaa)
                                } else {
                                    htmlchild = htmlchild.replace(/{ReportState}/, reportState)
                                    htmlchild = htmlchild.replace(/{hrefUrl}/, "#")
                                }
                                html += htmlchild;
                            }

                        } else {
                            $("#tips").show();
                        }
                        $("#reportList").html("");
                        $("#reportList").append(html);
                        hideMask();
                    }
                }

            });
        }

        //显示遮罩层    
        function showMask() {
            $("#mask").css("height", $(document).height());
            $("#mask").css("width", $(document).width());
            $("#mask").show();
        }
        //隐藏遮罩层  
        function hideMask() {

            $("#mask").hide();
        }
    </script>
</body>

</html>
